<template>
  <div>
    <input type="text" v-model="obj.name"> <br>
    <!-- 函数体 -->
    <input aa="11" type="text" :value="obj.name" @input="obj.name = $event.target.value" /> <br>
    <!-- <input aa="11" type="text" :value="obj.name" @input="console.log($event)" /> <br> -->
    <App807  v-model="obj.name"  ></App807>
    <!-- <App807  :model-value="obj.name"  @update:model-value="add" ></App807> -->
    <App807 :model-value="obj.name" @update:model-value="obj.name = $event "></App807>
    <App807 :model-value="obj.name" @update:model-value="console.log($event)"></App807>
  </div>
</template>

<script setup >
import App807 from './components/App807.vue';
import { reactive } from "vue";

let obj = reactive({ name: "张三" })

let add = function (val) {
  console.log(val);
  obj.name = val
}


</script>

<style scoped></style>=